<template>
  <el-table :data="agreementsList" border stripe>
    <!-- 索引列 -->
    <el-table-column type="index"></el-table-column>
    <el-table-column prop="name" label="协议名称"></el-table-column>
    <el-table-column prop="description" label="协议简述"></el-table-column>
    <el-table-column prop="type" label="协议类型 （0:用户登录 1:免责声明）"></el-table-column>
    <el-table-column label="操作" width="300px">
      <template slot-scope="scope">
        <!-- 删除按钮 -->
        <agreement-remove :agreement-id="scope.row.id" @update-list="updateAgreementList"/>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
import AgreementRemove from "@/components/agreement/agreementChildComponents/AgreementRemove.vue";

export default {
  name: "AgreementTable",
  props: {
    agreementsList: {
      type: Array,
      default() {
        return []
      }
    }
  },
  components: {
    AgreementRemove,
  },
  methods: {
    // 监听子组件中发出的事件，重新获取协议列表
    updateAgreementList() {
      this.$emit('update-list');
    }
  }
}
</script>

<style scoped>

</style>
